<template>
	<view>
		<view class="empty" v-if="systemList.length === 0">
			<image class="empty-img" src="https://static.wddzq.com/static/kong.png"></image>
			<view class="empty-text">暂无消息～</view>
		</view>
		<view class="cell" v-for="item in systemList" :key="item.id" @click="handleClick(item.actionType, item.pathLink)">
			<view class="cell-header">
				<view class="text">{{item.messageTitle}}</view>
				<view class="date">{{item.messageDate}}</view>
			</view>
			<view class="cell-desc">{{item.messageContent}}</view>
		</view>
	</view>
</template>

<script>
	import { getMessagePage } from '../../config/api.js';
	import { to } from '../../config/utils.js';
	
	export default {
		data() {
			return {
				filterData: {
					pages: 1,
					size: 20,
				},
				loading: false,
				hasMore: true,
				systemList: [],
				type: '',
			}
		},
		onPullDownRefresh() {
			this.resetSystem();
		},
		onReachBottom() {
			if(this.loading || !this.hasMore) return;
			this.filterData = {
				...this.filterData,
				pages: this.filterData.pages + 1
			};
			this.fetchMessagePage(this.filterData)
		},
		onLoad(options) {
			this.type = options.type;
		},
		onReady() {
			this.resetSystem();
		},
		methods: {
			// 重新请求接口
			resetSystem() {
				let params = {
					...this.filterData,
					pages: 1,
				};
				this.loading = false;
				this.hasMore = true;
				this.fetchMessagePage(params, true);
			},
			async fetchMessagePage(params, isClear) {
				this.loading = true;
				params.current = params.pages;
				const [err, systemList] = await to(getMessagePage({...params, messageType: this.type}));
				this.loading = false;
				uni.stopPullDownRefresh();
				if(err) return;
				let records = systemList?.data?.records || [];
				
				if(records.length < this.filterData.size) {
					this.hasMore = false;
				}
				this.systemList = isClear ? records : this.systemList.concat(records);
			},
			handleClick(actionType, pathLink) {
				if(actionType === 1) {
					pathLink && uni.navigateTo({
						url: pathLink
					})
				} else if(current.actionType === 2) {
					pathLink && uni.navigateTo({
						url: `/pages/webview/webview?url=` + encodeURIComponent(`${pathLink}`)
					})
				}
			},
		}
	}
</script>

<style>
.cell {
	background-color: #fff;
	padding: 24rpx;
	margin: 0 24rpx;
	margin-top: 21rpx;
	border-radius: 18rpx;
}
.cell-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.cell-header .text {
	height: 40rpx;
	font-size: 28rpx;
	font-weight: 500;
	color: #333333;
	line-height: 40rpx;
}
.cell-header .date {
	height: 32rpx;
	font-size: 24rpx;
	font-weight: 400;
	color: #999999;
	line-height: 32rpx;
}
.cell-desc {
	font-size: 24rpx;
	font-weight: 400;
	color: #999999;
	line-height: 33rpx;
	margin-top: 24rpx;
}
</style>
